<template>
    <div class="bread-container">
        <Icon icon="icon-fanhui" color="gray3" @click="goBack"></Icon>
        <el-breadcrumb separator="/">
            <el-breadcrumb-item v-for="(item,index) in breadList" :key="'bread'+index" :to="item.path?{ path: item.path }:''">{{ item.title }}</el-breadcrumb-item>
        </el-breadcrumb>
    </div>
</template>

<script setup>
import Icon from '@/components/common/Icon.vue'
import { useBreadStore } from '@/stores/bread';
import {useRouter} from 'vue-router'
const router=useRouter()
const breadStore=useBreadStore()
const breadList=breadStore.breadList
const goBack=()=>{
    router.push(breadList[breadList.length-2].path?breadList[breadList.length-2].path:'/')
}
</script>

<style lang="less" scoped>
.bread-container {
    display: flex;
    align-items: center;
    gap: 24px;
    :deep(.el-breadcrumb) {
        .el-breadcrumb__inner {
            font-weight: bold;
            font-size: 16px;
            line-height: 16px;
        }
    }
}
</style>
